<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorator="template">
<head>
    <meta charset="UTF-8"/>
    <title>车辆资料</title>
    <link rel="stylesheet" href="../css/carAdd.css"/>
    <link rel="stylesheet" href="../css/zoomify.css" />
    <script type="text/javascript" src="../js/zoomify.min.js"></script>
    <script type="text/javascript" src="../js/carAdd.js"></script>
</head>
<body id="orange">
<div class="container">
    <div class="content">
        <div class="container-right" layout:fragment="content">
            <div class="crumbs">
                <ul>
                    <li><a href="/index/home" th:text="#{System.home}">首页</a><i class="triangle-icon"></i></li>
                    <li><a href="###" th:text="#{System.member}">会员管理</a><i class="triangle-icon"></i></li>
                    <li class="active"><a href="###" th:text="#{System.mycarData}" >车辆资料</a></li>
                </ul>
            </div>
            <input id="listCarData" type="hidden"  th:value="${carDatajson}" />
            <input id="maxcar" type="hidden"  th:value="${carDataUser.maxcar}" />
            <input id="usertype" type="hidden"  th:value="${carDataUser.usertype}" />
            <input id="realname" type="hidden"  th:value="${carDataUser.realname}" />
            <div class="classification myCarType">
                <div class="type">
                    <label th:text="#{CarDataHtml.myCar}"></label>
                    <ul  class="myCar" id="myCarType">
                        <li  th:if="${carDataStat.count lt 19}"  th:each="carData,carDataStat : ${listCarData}" th:class="${carDataStat.first}?'active':''"><span th:onclick="'carNumberFn('+ ${carDataStat.index}+')'" th:text="${carData.plateNumber}"></span></li>
                        <li  id="addLi"><span onclick="return addFn()">+</span> </li>
                        <a  id="muchMore"  style="display: none" onclick="carSearchWindow()"><span  class="much" th:text="#{CarDataHtml.much_more}"></span> </a>

                    </ul>
                </div>
            </div>

            <div class="drive">
                <div class="drive-add">
                    <span class="drive-title" th:text="#{CarDataHtml.title}"></span>
                    <button id="btnUnbound" class="btn viewSample-btn"  onclick="unboundBtnFn()" th:text="#{CarDataHtml.deleterelation_btn}"><i class="icon-btn viewSample"></i></button>
                    <button  id="btnModify" class="btn viewSample-btn"  onclick="modifyFn()"  th:text="#{CarDataHtml.updateinfo_btn}"><i class="icon-btn modify"></i></button>
                </div>
            </div>
            <div class="form">
                <form class="demoform" id="form_id"  action="/carData/saveCarData"  method="post" enctype="multipart/form-data">
                    <input id="isOwner" type="hidden"  />
                    <input id="ID" name="id" type="hidden" />
               <div class="upload upload_background" id="uploadDiv">
                    <input type="file" name="imgUrl" class="img_upload" id="imgUrl" accept="image/gif, image/jpeg, image/png, image/jpg" />
                </div>
                <div class="viewimg" id="viewDiv" style="display: none;">
                    <input type="hidden"  id="hideImg" />
                    <img id="image-holder" class="viewimg thumb-image"  alt="无图片"/>
                    <span id="fileDel" class="delfile" style="display: none;" th:text="#{registerHtml.verifyphotoDel}">移除</span>
                </div>
                <div class="form-list">
                    <label class="label" th:text="#{CarDataHtml.recognition_code}"></label>
                    <input class="required" id="txtVIN" name="recognitionCode" maxlength="17" type="text" style="width:300px;" />
                    <button id="btnAutoFind" class="btn viewSample-btn" onclick="return autoFindBtnFn()" hidden="hidden" th:value="#{CarDataHtml.auto_find_btn}"><i class="icon-btn automatic"></i>自动识别</button>
                </div>
                    <div class="form-list">
                        <label class="label" th:text="#{CarDataHtml.plate_type}"></label>
                        <select    id="txtVehicleType" class="required" name="plateType">
                            <option value="小型轿车" th:text="#{CarDataHtml.plate_type_small_car}"></option>
                            <option value="大型货车"  th:text="#{CarDataHtml.plate_type_big_car}"></option>
                        </select>
                    </div>
                    <div class="form-list">
                    <label class="label" th:text="#{CarDataHtml.plate_number}"></label>
                    <input id="codeValue" name="plateNumber" type="text" maxlength="15" class="required w150"  />
                   </div>
                <div class="form-list">
                    <label class="label" th:text="#{CarDataHtml.holder}"></label>
                    <input id="txtOwner" name="holder" type="text" class="required w150" maxlength="20"/>
                    <input type="button" class="btn viewSample-btn" id="holderRegister" onclick="holderRegisterClick()" th:value="#{CarDataHtml.holder_register}"/>
                    <input type="button" class="btn viewSample-btn" id="manageHoderCar" onclick="manageHoderCarClick()" th:value="#{CarDataHtml.manage_holder_car}"/>
                </div>
                <div class="form-list">
                    <label class="label" th:text="#{CarDataHtml.register_date}"></label>
                    <input id="registerDate" name="registerDate"  class="required  w150 Wdate" onfocus="WdatePicker({readOnly:true,isShowClear:false,maxDate:'%y-%M-%d'})"  />
                </div>
                <div class="form-list">
                    <label class="label"  th:text="#{CarDataHtml.brand_model}"></label>
                    <input id="txtModel" name="brandModel" type="text" class="w150" maxlength="30"  />
                </div>
                <div class="form-list">
                    <label class="label" th:text="#{CarDataHtml.address}"></label>
                    <input id="txtAddress"  name="address" type="text" style="width:300px;"  maxlength="100" />
                </div>
                <div class="form-list" >
                    <label class="label" th:text="#{CarDataHtml.fuel_type}" style="margin-top: 10px;"></label>
                    <div class="payment" >
                        <div class="online-payment"   >
                            <input type="radio" class="require" value="柴油" name="fuelType" id="fuelTypeC" onclick="fuelTypeClick(this)"/>
                            <span  id= "spanactive" class="online-payment-custom active"></span>
                            <label for="fuelTypeC" style="width:40px;" th:text="#{CarDataHtml.fuel_type_2}">柴油</label>
                        </div>
                        <div class="shop-payment"  >
                            <input type="radio" class="require" value="汽油" name="fuelType" id="fuelTypeQ" onclick="fuelTypeClick(this)"/>
                            <span class="shop-payment-custom"></span>
                            <label for="fuelTypeQ" style="width:60px;" th:text="#{CarDataHtml.fuel_type_1}">汽油</label>
                        </div>
                    </div>
                </div>
                <div class="form-list" >
                    <label class="label" style="margin-top: 10px;" th:text="#{CarDataHtml.project_nature}"></label>
                    <div class="payment" >
                        <div class="online-payment"  >
                            <input type="radio" class="require" value="营运" name="projectNature"  id="projectNatureY" onclick="fuelTypeClick(this)" />
                            <span   class="online-payment-custom active"></span>
                            <label for="projectNatureY" style="width:40px;" th:text="#{CarDataHtml.project_nature_1}">营运</label>
                        </div>
                        <div class="shop-payment" >
                            <input type="radio" class="require" value="非营运" name="projectNature" onclick="fuelTypeClick(this)" id="projectNatureN"  />
                            <span class="shop-payment-custom"></span>
                            <label for="projectNatureN" style="width:60px;" th:text="#{CarDataHtml.project_nature_2}">非营运</label>
                        </div>
                    </div>
                </div>
                <div class="form-list" id="btn_subDiv">
                    <span>提交后，平台客服人员会进行审查核实工作，大概需要2个工作日。</span>
                    <input class="btn viewSample-btn commit-btn" id="btn_sub" onclick="return commitFn()" type="submit" value="提交"  disabled="disabled"/>
                </div>
                  <div style="display: none"><input type="reset" id="reset" /></div>
                </form>
            </div>
            <!--查询更多车牌-->
            <div id="divPhone" class="popPhone">
                <div class="dialog-title"  onselectstart="return false;" >
                    <span style="font-weight:bold;text-align: center;" th:text="#{CarDataHtml.search_more_plate}">查询更多车牌</span>
                    <a href="javascript:void(0)" onclick = "$('#divPhone').hide();$('#divPhoneBlack').hide();"  class="btn-phoneClose"></a>
                </div>
                    <div style="margin-top: 15px;">
                        <div style="width: 90px;text-align: right;margin-bottom: -28px;">
                            <label th:text="#{CarDataHtml.plate_number}"></label>
                        </div>
                        <input type="text"  id="plateNumber" name="plateNumber" class="popPhoneText" style="width:200px;margin-left: 100px;"/>
                        <input  class="btnButton" type="submit" style="width: 80px; margin-left: 20%;" value="查询" onclick="searchPlata()"/>
                    </div>
                <div>
                    <div>
                        <table id="tabindex" class="oa" >
                            <thead class="thead">
                              <th style="text-align: center" th:text="#{CarDataHtml.plate_number}"></th>
                              <th style="text-align: center" th:text="#{CarDataHtml.holder}"></th>
                            </thead>
                            <tbody id="tableBody">
                                 <tr style="text-align: center"><td colspan="2" style="text-align: center">输入查询条件,点击查询按钮</td></tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="pagenation frt" style="display:none" id="fanye">
                        <div class="clearfix">
                            <div class="flt">
                                <ul id="page">
                                    <li><a href="javascript:splitPage(--currpageno)"
                                           id="up"><img
                                            src="/img/pageleft.png" /></a></li>
                                    <li><a class="pge-current" id="currNumTab">1</a></li>
                                    <li><a href="javascript:splitPage(++currpageno)"
                                           id="next"><img
                                            src="/img/pageright.png" /></a></li>
                                </ul>
                            </div>
                            <div class="sum frt">
                                共&nbsp;<span id="totleNumTab">0</span>&nbsp;页
                            </div>
                        </div>
                    </div>
                    <div class="clear"></div>

                </div>


            </div>
            <div id="divPhoneBlack" class="black_overlay"></div>

            <!--认证车主-->
            <div id="divPhone1" class="popPhone">
                <form class="demoform" id="form_card"  action="/carData/ownerCar"  method="post" enctype="multipart/form-data">
                <div class="dialog-title"  onselectstart="return false;" >
                    <span style="font-weight:bold;text-align: center;" th:text="#{CarDataHtml.holder_register}">认证车主</span>
                    <a href="javascript:void(0)" onclick = "$('#divPhone1').hide();$('#divPhoneBlack1').hide();"  class="btn-phoneClose"></a>
                </div>
                <div style="margin-top: 15px;">
                    <div style="width: 90px;text-align: right;margin-bottom: -28px;">
                        <label th:text="#{CarDataHtml.plate_number}"></label>
                    </div>
                    <input id="IDupload" name="idUpload"  type="hidden"  />
                    <input type="text"  id="plateNumber1" name="plateNumber1" class="popPhoneText" style="width:200px;margin-left: 100px;"/>
                </div>
                <div class="form-list">
                    <div style="width: 90px;text-align: right;margin-bottom: -28px;">
                        <label  th:text="#{CarDataHtml.identity_card}">身份证</label>
                    </div>
                    <span id="filePicker1" class="selectfile"><span th:text="#{registerHtml.verifyphotoSel}"></span>
                        <input type="file" id="identitycard" name="identitycard" style="position:absolute;left:0;top:0;z-index:999;opacity:0;cursor: pointer; direction: ltr;font-size: 0;width: 80%;height:80%;" accept="image/gif, image/jpeg, image/png, image/jpg"/>
                    </span>
                    <img id="image-holder1" class="viewimg1 thumb-image" style="display: none;">
                    <span id="fileDel1" class="delfile" style="display: none;" th:text="#{registerHtml.verifyphotoDel}">
                    </span>
                    </img>

                </div>
                    <div class="form-list">
                    <input type="submit" class="btn viewSample-btn "  style="position: absolute;margin-left: 220px;margin-top: 100px;" onclick="return cardsubmit()" />

                    </div>

                </form>

            </div>
            <div id="divPhoneBlack1" class="black_overlay"></div>



            <!--车主解绑车辆-->
            <div id="divPhoneCar" class="popPhone">
                <div class="dialog-title"  onselectstart="return false;" >
                    <span style="font-weight:bold;text-align: center;" th:text="#{CarDataHtml.manage_holder_car}"></span>
                    <a href="javascript:void(0)" onclick = "$('#divPhoneCar').hide();$('#divPhoneBlackCar').hide();"  class="btn-phoneClose"></a>
                </div>
                <div style="margin-top: 15px;">
                    <div style="width: 90px;text-align: right;margin-bottom: -28px;">
                        <label th:text="#{CarDataHtml.plate_number}"></label>
                    </div>
                    <input type="text"  id="plateNumberCar" name="plateNumber" class="popPhoneText" style="width:200px;margin-left: 100px;" disabled="disabled"/>
                </div>
                <div>
                    <div>
                        <table id="tabindexCar" class="oa" >
                            <thead class="thead">
                            <th style="text-align: center" th:text="#{CarDataHtml.plate_number}"></th>
                            <th style="text-align: center" th:text="#{CarDataHtml.holder}"></th>
                            <th style="text-align: center" th:text="#{CarDataHtml.todo}"></th>
                            </thead>
                            <tbody id="tableBodyCar">
                            <tr style="text-align: center"><td colspan="3" style="text-align: center">输入查询条件,点击查询按钮</td></tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="pagenation frt" style="display:none" id="fanyeCar">
                        <div class="clearfix">
                            <div class="flt">
                                <ul id="pageCar">
                                    <li><a href="javascript:splitPage(--currpageno)"
                                           id="upCar"><img
                                            src="/img/pageleft.png" /></a></li>
                                    <li><a class="pge-current" id="currNumTabCar">1</a></li>
                                    <li><a href="javascript:splitPage(++currpageno)"
                                           id="nextCar"><img
                                            src="/img/pageright.png" /></a></li>
                                </ul>
                            </div>
                            <div class="sum frt">
                                共&nbsp;<span id="totleNumTabCar">0</span>&nbsp;页
                            </div>
                        </div>
                    </div>
                    <div class="clear"></div>

                </div>


            </div>
            <div id="divPhoneBlackCar" class="black_overlay"></div>
        </div>
    </div>
</div>



</body>
</html>